import React from 'react'
import { Modal, Button, Form, Input } from 'antd'

const FormItem = Form.Item

const OrganizationForm = ({
  onOk, organizationType, parentItem, item, form: {
    getFieldDecorator,
    validateFields,
  }, ...modalProps
}) => {
  const formItemLayout = {
    labelCol: {
      xs: { span: 8, offset: 0 },
      sm: { span: 8, offset: 0 },
    },
    wrapperCol: {
      xs: { span: 8, offset: 0 },
      sm: { span: 8, offset: 0 },
    },
  }

  const onSubmit = (e) => {
    e.preventDefault()
    validateFields((err, values) => {
      if (!err) {
        values.priority = item.priority || 0
        onOk(values)
      }
    })
  }

  const modalOpts = {
    ...modalProps,
    onOk: onSubmit,
  }
  /** @namespace item.name 组织机构名称*/
  /** @namespace item.code 组织机构编码*/
  /** @namespace item.description 组织机构描述*/
  /** @namespace item.priority 组织机构优先级*/
  /** @namespace item.distributorSigner */
  return (
    <Modal {...modalOpts}>
      <Form layout="horizontal">
        <FormItem {...formItemLayout} label="父级组织机构">
          {parentItem.parentId === '-1' ? '顶级组织结构' : parentItem.name}
          {getFieldDecorator('parentId', {
            initialValue: parentItem.id,
          })(<Input type='hidden' />)}
        </FormItem>

        <FormItem {...formItemLayout} label="名称">
          {getFieldDecorator('name', {
            rules: [{ required: true, message: '名称必须填写!' }],
            initialValue: item.name,
          })(<Input disabled={organizationType==='update'} placeholder='请输入名称' />)}
        </FormItem>

        <FormItem {...formItemLayout} label="编码">
          {getFieldDecorator('code', {
            rules: [{ required: true, message: '编码必须填写!' }],
            initialValue: item.code,
          })(<Input disabled={organizationType==='update'} placeholder='请输入编码' />)}
        </FormItem>

        <FormItem {...formItemLayout} label="描述">
          {getFieldDecorator('description', {
            rules: [{ required: true, message: '描述必须填写!' }],
            initialValue: item.description,
          })(<Input placeholder='请输入描述' />)}
        </FormItem>
      </Form>
    </Modal>
  )
}

export default Form.create()(OrganizationForm)
